<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>购物车</title>
     <!-- 引入重置样式 -->
     <link rel="stylesheet" href="css/reset.css">
     <!-- 引入公共样式 -->
     <link rel="stylesheet" href="css/common.css">
     <!-- 引入购物车样式 -->
     <link rel="stylesheet" href="css/buy.css">
</head>
<body>
       <!-- 头部 -->
       <header id="header">
        <div class="top">
            <div class="container clearfix">
                <div class="fl">legochina.cn</div>
                <div class="fr">
                    欢光临<a href="index.html">乐购</a> ,请&emsp;<a href="login.html">登录</a> / <a href="register.html">注册</a>
                </div>
                <a href="index.html" class="logo">
                    <img src="images/index/logo.jpg">
                </a>
            </div>
        </div>
        <div class="searchbox container clearfix">
            <div class="my clearfix">
                <a href="">购物车&nbsp;<em>3</em></a>
                <a href="">我的订单</a>
            </div>
            <form action="">
                <input type="text" name="" id="" class="fl" placeholder="设计中的设计 原研哉">
                <input type="submit" value="" id="sub" class="fl">
            </form>
        </div>
        <div class="address container">
          <span>配送至</span>
          <select name="" id="">
            <option value="" selected>成都高新区三环内</option>
            <option value="">成都高新区二环内</option>
            <option value="">成都高新区一环内</option>
          </select>
        </div>
    </header>
    
    <!-- 购物车表格 -->
    <section id="cartbox" class="container legou-container">
      <div class="title">填写并核对订单信息</div>
        <table>
          <thead>
            <tr class="tcenter">
              <td><input type="checkbox" class="selectall"/>全选</td>
              <td>商品</td>
              <td>单价</td>
              <td class="w1">数量</td>
              <td class="w2">小计</td>
              <td class="w3">操作</td>
            </tr>
          </thead>
          
          <tbody>
            <tr class="h"><td><div></div></td></tr>
            <tr>
              <td class="tcenter"><input type="checkbox"  class="single"/></td>
              <td class="imgbox">
                <img src="./images/book/23353342-1_l.jpg" alt="" />
                从你的全世界路过
              </td>
              <td class="singlePrice">41.00</td>
              <td> 
                <div class="numbox clearfix">
                  <a class="redu">-</a>
                  <input type="text" name="" id="" class="num" value="1">
                  <a class="add">+</a>
                </div>
              </td>
              <td class="price">41.00</td>
              <td>
                <a class="del"> 删除</a>
              </td>
            </tr>
            <tr class="h"><td><div></div></td></tr>
            <tr>
              <td class="tcenter"><input type="checkbox"  class="single"/></td>
              <td class="imgbox">
                <img src="./images/book/17.jpg" alt="" />
                春
              </td>
              <td class="singlePrice">49.00</td>
              <td> 
                <div class="numbox clearfix">
                  <a class="redu">-</a>
                  <input type="text" name="" id="" class="num" value="1">
                  <a class="add">+</a>
                </div>
              </td>
              <td class="price">41.00</td>
              <td>
                <a class="del"> 删除</a>
              </td>
            </tr>
           
            
          </tbody>
          <tfoot>
            <tr class="h"><td><div></div></td></tr>
            <tr>
              <td class="tcenter"><input type="checkbox"  class="selectall"/>全选</td>
              <td>
                <a class="delselect">删除选中商品</a>
              </td>
              <td colspan="2">已选择&emsp;<span id="selectnum">0</span>&emsp;件商品</td>
              <td>总价&emsp;<span id="totle">0.00</span>&emsp;</td>
              <td>
                <a id="settlement"> 去结算</a>
              </td>
            </tr>
          </tfoot>
        </table>
      </section>
      <!-- 猜你喜欢 -->
      <section id="popularity" class="container">
        <div class="title">
            <h2>猜你喜欢</h2>
        </div>
        <div class="p_con">
            <div class="con">
                <a href="" class="bookimg"><img src="images/book/10.jpg" alt=""></a>
                <div class="discount">
                    8折
                </div>
                <p><a href="">白夜行</a><a href="">东野上吾</a></p>
                <div>推荐 <img src="images/book/6.jpg" alt=""></div>
                <p>￥：38 <span>￥：58</span></p>
            </div>
            <div class="con">
                <a href="" class="bookimg"><img src="images/book/11.jpg" alt=""></a>
                <div class="discount">
                    8折
                </div>
                <p><a href="">白夜行</a><a href="">东野上吾</a></p>
                <div>推荐 <img src="images/book/6.jpg" alt=""></div>
                <p>￥：38 <span>￥：58</span></p>
            </div>
            <div class="con">
                <a href="" class="bookimg"><img src="images/book/12.jpg" alt=""></a>
                <div class="discount">
                    8折
                </div>
                <p><a href="">白夜行</a><a href="">东野上吾</a></p>
                <div>推荐 <img src="images/book/6.jpg" alt=""></div>
                <p>￥：38 <span>￥：58</span></p>
            </div>
            <div class="con">
                <a href="" class="bookimg"><img src="images/book/13.jpg" alt=""></a>
                <div class="discount">
                    8折
                </div>
                <p><a href="">白夜行</a><a href="">东野上吾</a></p>
                <div>推荐 <img src="images/book/6.jpg" alt=""></div>
                <p>￥：38 <span>￥：58</span></p>
            </div>
            <div class="con">
                <a href="" class="bookimg"><img src="images/book/14.jpg" alt=""></a>
                <div class="discount">
                    8折
                </div>
                <p><a href="">白夜行</a><a href="">东野上吾</a></p>
                <div>推荐 <img src="images/book/6.jpg" alt=""></div>
                <p>￥：38 <span>￥：58</span></p>
            </div>
        </div>
    </section>
    <!-- 广告 -->
    <section class="ad container">
      <img src="images/book/3.jpg" alt="">
  </section>
      <!-- 页尾 -->
      <footer id="footer">
        <div class="service">
            <div class="container">
               <a href=""><img src="images/index/222_11.png" alt=""> </a>
               <a href=""><img src="images/index/222_13(1).png" alt=""> </a>
               <a href=""><img src="images/index/222_15.png" alt=""> </a>
               <a href=""><img src="images/index/222_17.png" alt=""> </a>
            </div>
        </div>
        <div class="help container clearfix">
            <ul>
                <li><h5>购物指南</h5></li>
                <li><a href="">购物流程</a></li>
                <li><a href="">发票制度</a></li>
                <li><a href="">账户管理</a></li>
                <li><a href="">会员优惠</a></li>
            </ul>
            <ul>
                <li><h5>支付方式</h5></li>
                <li><a href="">货到付款</a></li>
                <li><a href="">网上支付</a></li>
                <li><a href="">礼品卡支付</a></li>
                <li><a href="">银行转帐</a></li>
            </ul>
            <ul>
                <li><h5>订单服务</h5></li>
                <li><a href="">订单状态说明</a></li>
                <li><a href="">自助取消订单</a></li>
                <li><a href="">自助修改订单</a></li>
                <li><a href="">订单配送查询</a></li>
            </ul>
            <ul>
                <li><h5>退换货</h5></li>
                <li><a href="">退换货政策</a></li>
                <li><a href="">自助申请退换货</a></li>
                <li><a href="">退换货进度查询</a></li>
                <li><a href="">退款方式和时间</a></li>
            </ul>
            <ul>
                <li><h5>商家服务</h5></li>
                <li><a href="">商家中心</a></li>
                <li><a href="">运营服务</a></li>
                <li><a href="">加入尾品汇</a></li>
            </ul>
            <img src="images/index/logo_00.png" alt="">
        </div>
        <div class="footer_botm container">
            <a href="">公司简介</a>&emsp;|&emsp;
            <a href=""> Investor Relations</a>&emsp;|&emsp;
            <a href=""> 网站联盟 </a>&emsp;|&emsp;
            <a href=""> 乐购招商  </a>&emsp;|&emsp;
            <a href=""> 机构销售  </a>&emsp;|&emsp;
            <a href=""> 手机乐购  </a>&emsp;|&emsp;
            <a href=""> 官方Blog  </a>&emsp;|&emsp;
            <a href=""> 热词搜索  </a>
            <p>Copyright (C) 乐购网 2004-2016, All Rights Reserved</p>
        </div>
        <!-- 回到顶部 -->
        <div id="totop">
            <img src="images/index/gototop_05.jpg" alt="">
        </div>
    </footer> 
</body>
<!-- 1. 引入jQuery -->
<script src="lib/jquery.js"></script>
<!-- 2.引入公共js -->
<script src="js/common.js"></script>
<!-- 3. 引入当前页面js文件 -->
<script src="js/buy.js"></script>
</html>